<div class="field-input-edit">
  <div [formGroup]="form">
    <ng-container [ngSwitch]="elem.input">

      <ng-container *ngSwitchCase="'text'">
        <input [(ngModel)]="model[elem.colCode]" formControlName="{{'elem-'+elem.id}}"
               type="text" class="form-control">
      </ng-container>

      <ng-container *ngSwitchCase="'textarea'">
        <textarea [(ngModel)]="model[elem.colCode]" formControlName="{{'elem-'+elem.id}}"
                  type="text" class="form-control"></textarea>
      </ng-container>

      <ng-container *ngSwitchCase="'dropdown'">
        <select [(ngModel)]="model[elem.colCode]" formControlName="{{'elem-'+elem.id}}" class="form-control">
          <option *ngFor="let item of options" value="{{item.id}}">{{item.label}}</option>
        </select>
      </ng-container>

      <ng-container *ngSwitchCase="'radio'">
        <label class="col-form-label">
            <ng-container *ngFor="let item of options">
              <input [(ngModel)]="model[elem.colCode]" formControlName="{{'elem-'+elem.id}}"
                     value="{{item.id}}" type="radio">
              <span>{{item?.label}}</span>&nbsp;
            </ng-container>
        </label>
      </ng-container>

      <ng-container *ngSwitchCase="'checkbox'">
        <label class="col-form-label">
          <ng-container *ngFor="let item of options">
            <input [(ngModel)]="checkboxVal[item.id]" (change)="checkboxValChange()" [ngModelOptions]="{standalone: true}"
                   value="{{item.id}}" type="checkbox">
            <span>{{item?.label}}}}</span>&nbsp;
          </ng-container>
        </label>
      </ng-container>

      <ng-container *ngSwitchCase="'multi_select'">
        <select [(ngModel)]="mutiSelectVal" (change)="mutiSelectValChange()" multiple
                [ngModelOptions]="{standalone: true}" class="form-control">
          <option *ngFor="let item of options" value="{{item.id}}">{{item?.label}}</option>
        </select>
      </ng-container>

      <ng-container *ngSwitchCase="'richtext'">
        <tiny-mce [content]="model[elem.colCode]" [height]="'300px'"
                  (changed)="richtextChange($event)"></tiny-mce>
      </ng-container>

      <ng-container *ngSwitchCase="'date'">
        <div class="input-group my-flatpickr-date">
          <input [(ngModel)]="model[elem.colCode]" formControlName="{{'elem-'+elem.id}}"
                 type="text" placeholder="yyyy-mm-dd" readonly="readonly"
                 class=" form-control form-control-sm" data-input #startTime>
          <a class="input-group-addon" title="选择" data-toggle>
            <i class="fa fa-calendar"></i>
          </a>
          <a class="input-group-addon" title="清除" data-clear>
            <i class="fa fa-remove"></i>
          </a>
        </div>
      </ng-container>

      <ng-container *ngSwitchCase="'time'">
        <div class="input-group my-flatpickr-time">
          <input [(ngModel)]="model[elem.colCode]" formControlName="{{'elem-'+elem.id}}"
                 type="text" placeholder="hh:mm" readonly="readonly"
                 class=" form-control form-control-sm" data-input>
          <a class="input-group-addon" title="选择" data-toggle>
            <i class="fa fa-calendar"></i>
          </a>
          <a class="input-group-addon" title="清除" data-clear>
            <i class="fa fa-remove"></i>
          </a>
        </div>
      </ng-container>

      <ng-container *ngSwitchCase="'datetime'">
        <div class="input-group my-flatpickr-datetime">
          <input [(ngModel)]="model[elem.colCode]" formControlName="{{'elem-'+elem.id}}"
                 type="text" placeholder="yyyy-mm-dd hh:mm" readonly="readonly"
                 class=" form-control form-control-sm" data-input>
          <a class="input-group-addon" title="选择" data-toggle>
            <i class="fa fa-calendar"></i>
          </a>
          <a class="input-group-addon" title="清除" data-clear>
            <i class="fa fa-remove"></i>
          </a>
        </div>
      </ng-container>

      <ng-container *ngSwitchDefault>
        elem.input = {{elem.input}}
      </ng-container>

    </ng-container>

  </div>
</div>
